<template>
<div class="main">
  <div>{{all_myrest_QueryKnowledgeGroup==null?'':''}}</div>
  <div>{{all_myrest_CreateKnowledgeGroupOrder==null?'':''}}</div>
  <div class="banner" style="height: 190px;"><img src="http://tpzs.lep365.com/group1/M00/00/3C/rBDEWVlI2JmAOGTJAACjHM6sgsY266.png"></div>
  <div class="courseInfo">
      <h3>{{KnowledgeGroup.title}}</h3>
      <div class="price">￥{{KnowledgeGroup.price/100}}</div>
      <div class="precnt">{{KnowledgeGroup.intro}}</div>
  </div>
  <div class="courseList" style="height: 389px;">
      <ul style="height: 389px;">
          <router-link :to="{path:'/KnowledgeCnt'+ '/' + item.id + '/'+groupID}" v-for="item in knowledgeList">
          <!--<a href="../knowledgeCnt/knowledgeCnt.html?listiid=7fc250a4b2fd4e5c88dac8c36af7200c">-->
              <li class="active">
                  <div class="tuwen"><img src="../assets/images/buy_icon_text.png"></div>
                  <div class="title">{{item.title}}</div>
                  <div class="jfinside">内含{{item.totalReward}}积分</div>
              </li>
          <!--</a>-->
          </router-link>
      </ul>
  </div>

  <div class="footerBuy">
      <div class="buyBtn" v-on:click="goBuy()">立即购买</div>
  </div>
</div>

</template>

<script>
  import stores from './mystore.js'
  import Vue from 'vue';
  import { XButton, XInput,Group, Tab, TabItem } from 'vux'
  import { mapGetters,mapActions } from 'vuex'
  import sha1 from 'js-sha1'

  export default {
    data(){
      return {
          userToken:'',
          userSecert:'',
          knowledgeGroupIds:[],
          orderNo:'',
          totalPrice:'',
          dataval:'',
          groupID:'',
          KnowledgeGroup:[],
          knowledgeList:[],
          successMsg:"",
          items:[1,2,3,4,5],
          mypayload:{
              url:'baseapi',
              actionName:"QueryKnowledgeGroup",
              postData:{
                  "knowledgeGroupId":"",
//                "haveVideo":"false",
//                "pageNo":1,
//                "pageSize":1
              }
          },
          GroupOrderPayload:{
              key:'orderNo',
              url:'baseapi',
              actionName:"CreateKnowledgeGroupOrder",
              postData: {
                  "knowledgeGroupIds":[],

              }
          },
      }
    },

    computed:{
        all_myrest(){
            return this.$store.getters.all_restful
        },
        all_myrest_QueryKnowledgeGroup(){
            var userToken=window.localStorage.getItem("ls-token")
            var dataval=this.$store.getters.all_restful_single_QueryKnowledgeGroup;
            if(dataval){
                this.KnowledgeGroup=dataval.body.knowledgeGroupList[0]
                this.knowledgeList=dataval.body.knowledgeGroupList[0].knowledgeList;
                return dataval.body
            }else{
                return null
            }
        },
        all_myrest_CreateKnowledgeGroupOrder(){
          console.log("userToken:::"+window.localStorage.getItem("ls-token"))
            var dataval=this.$store.getters.all_restful_orderNo_CreateKnowledgeGroupOrder;
            if(dataval){
                this.orderNo=dataval.body.orderNo;
                this.totalPrice=dataval.body.totalPrice;
                //window.location.href='http://m.lep365.com/get-weixin-code.html?appid=wxf915dbfb1b2c6ab8&scope=snsapi_base&state=kcgm'
                window.location.href='http://m.lep365.com/v2/zzpage.html?token='+this.userToken+'&secret='+this.userSecert+'&orderid='+this.orderNo+'&totalprice='+this.totalPrice
                return dataval.body
            }else{
                return null
            }
            //return dataval;
        },
        all_nots(){
            return this.$store.getters.all_nots
        },
        all_login(){
            return this.$store.getters.all_login
        },
        ...mapGetters([ 'evenOrOdd'
        ])
    },
    created (){
      this.userToken=window.localStorage.getItem("ls-token")
      this.userSecert=window.localStorage.getItem("ls-secert")
      //console.log("userToken:::"+userToken)ls-secert
      var groupId=this.$route.params.groupId;
      this.knowledgeGroupIds.push(groupId)
      this.GroupOrderPayload.postData.knowledgeGroupIds.push(groupId);
      this.groupID=this.mypayload.postData.knowledgeGroupId=groupId;
      this.cntReady();
    },

    methods:{
      cntReady(){
          this.$store.commit('restful_api',this.mypayload);
          //alert(2)
      },
      goBuy:function(){
        alert(1)
        console.log("userToken:::"+window.localStorage.getItem("ls-token"))
        console.log("课程组id：：：：：：：：：：：：：："+this.GroupOrderPayload.postData.knowledgeGroupIds[0])
          this.$store.commit('restful_api',this.GroupOrderPayload);
      },

      ...mapActions([
        'increment',
        'decrement',
        'incrementIfOdd'
      ]),
    },
    components: { XButton, Group, XInput, Tab, TabItem }

  }

</script>

<style scoped>
  *{ margin: 0; padding: 0; font-size: 14px;}
  body{ background-color: #fff;}
  a{ text-decoration: none; color: #000;}
  .clear:after{ display: block; clear: both; content: ''; height: 0;}
  div img{ width: 100%; display: block;}

  /*** 顶部 header ***/
  .main{ background-color: #fff;}
  .header{ background-color: #f5f5f5; border-bottom: 1px solid #e5e5e5; position: relative; padding: 15px 0;}
  .header_tit{ text-align: center; font-weight: bold; font-size: 18px; }
  .goback{ width: 20px; position: absolute; left: 20px; top:16px;}
  .goback img{ width: 13px;}
  .header_yigou{ position: absolute; right: 20px; top:16px; color: #828b93; font-size: 14px;}

  .banner{ width:100%;}
  .banner img{ width:100%; height:100%;}
  .courseInfo{ width:100%; font-size:18px; box-sizing:border-box; -webkit-box-sizing:border-box; padding:14px 10px 20px 10px;}
  .courseInfo{ font-size:18px; color:#3D3836; border-bottom:1px solid #eee;}
  .price{ color:red; padding-top:5px;}
  .precnt{ padding-top:10px; font-size:12px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;}

  .courseList li{ box-sizing:border-box; -webkit-box-sizing:border-box; padding:18px 15px 18px 10px; display:box;  display:-webkit-box; border-bottom:1px solid #eee; }
  .courseList li.active{ background-color:#fefcf8;}
  .courseList .tuwen{ box-sizing:border-box; -webkit-box-sizing:border-box; width:30px; padding-top:1px;}
  .courseList .tuwen img{ width:100%;}
  .courseList .title{ box-sizing:border-box; -webkit-box-sizing:border-box; -webkit-box-flex:1; box-flex:1; padding-left:12px;}
  .courseList .jfinside{ color:#d7b35e; text-align:right; box-sizing:border-box; -webkit-box-sizing:border-box; width:100px;}

  .courseList ul{ overflow:hidden; overflow-y:scroll;}

  a li .title{ color:#000;}

  .footerBuy{ width: 100%; background-color: #ff9900; position: fixed; bottom: 53px; left: 0;}
  .buyBtn{ font-size: 16px; line-height: 53px; width: 100px; margin: 0 auto; color: #fff; text-align: center;}
</style>






